<!-- 查询管理员 -->
<template>
  <div class="selAdmin-container">
    <TitleBar title="查询管理员"></TitleBar>
    <div class="main">
      <BackgroundBox>
        <el-table :data="adminData" style="width: 100%">
          <el-table-column prop="Nickname" label="姓名" />
          <el-table-column prop="adminId" label="学工号" />
          <el-table-column prop="phone" label="手机号" />
          <el-table-column label="身份">
            <template #default="scope">
              <p
                :class="{
                  admin: scope.row.authentication,
                  super: !scope.row.authentication,
                }"
              >
                {{ scope.row.authentication ? "普通管理员" : "超级管理员" }}
              </p>
            </template>
          </el-table-column>
          <el-table-column label="管理宿舍楼">
            <template #default="scope">
              <div v-if="scope.row.Dormitories !== -1">
                <span v-for="item in scope.row.Dormitories" :key="item.id"
                  >{{ item.DormitoryName }}&nbsp;&nbsp;</span
                >
              </div>
              <div v-else class="All">所有宿舍</div>
            </template>
          </el-table-column>
          <el-table-column label="操作">
            <template #default="scope">
              <el-button
                size="small"
                type="primary"
                :disabled="
                  scope.row.authentication === 0 ||
                  readUserInfo.id === scope.row.id
                "
                @click="handleReset(scope.row)"
              >
                重置
              </el-button>
              <el-button
                size="small"
                type="danger"
                :disabled="
                  scope.row.id === 1 || readUserInfo.id === scope.row.id
                "
                @click="handleDelete(scope.row)"
              >
                删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </BackgroundBox>
    </div>
  </div>
</template>

<script setup>
import TitleBar from "@/components/TitleBar/index.vue";
import BackgroundBox from "@/components/BackgroundBox/index.vue";
import { useUserStore } from "@/store/useUserStore.js";
import { storeToRefs } from "pinia";
const { readUserInfo } = storeToRefs(useUserStore());
import { resetting, deladmin } from "@/api/user.js";
const props = defineProps({
  adminData: {
    type: Array,
    required: true,
  },
});

// 重置密码
const handleReset = async (item) => {
  ElMessageBox.prompt("请输入重置的后的密码", "是否重置", {
    confirmButtonText: "重置",
    cancelButtonText: "取消",
    inputPattern: /^\d{6,10}$/,
    inputErrorMessage: "请输入6-10的密码",
  }).then(async ({ value }) => {
    const { data } = await resetting({
      adminId: item.adminId,
      phone: item.phone,
      nickname: item.Nickname,
      newPwd: value,
    });
    if (data) {
      ElMessage({
        message: "重置成功",
        type: "success",
      });
    }
  });
};
const emit = defineEmits("handleDelete")
// 删除管理员
const handleDelete = (item) => {
  ElMessageBox.confirm("确定删除吗?", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
  }).then(async () => {
    const { data } = await deladmin(item.id);
    if (data) {
      ElMessage({
        type: "success",
        message: "删除成功",
      });
      emit("handleDelete")
    }
  });
};
</script>

<style lang="less" scoped>
@import "@/styles/var.less";
.selAdmin-container {
  width: 100%;
  .main {
    width: 100%;
    padding-bottom: 60px;
    .back-container {
      padding: 20px;

      .All {
        color: @gray;
      }
      .admin {
        color: @primary;
      }
      .super {
        color: @danger;
      }
    }
  }
}
</style>